<template>
  <div id="reStrategyName">
    <mt-header fixed title="修改策略名称" v-if="isHeader">
      <mt-button icon="back" slot="left" @click="goBack"></mt-button>
    </mt-header>
    <div class="reStrategyName-cont" :class="isHeader?'isHeader':''">
      <div class="writ-btn">
        <input maxlength="20" class="input" type="text" v-model="strategy.strategy_name">
      </div>
      <div class="tip-text">
        2~20位中文、英文（大小写组合）
      </div>
      <div class="fin-btn" @click="reStrategy">
        完成
      </div>
    </div>
  </div>
</template>

<script>
  import REQUEST from './../services/test'
  import {Toast} from 'mint-ui'

  export default {
    name: 'reStrategyName',
    data () {
      return {
        isHeader: false,
        strategy: {
          strategy_name: ''
        }
      }
    },
    created () {
      this.$store.commit('getUrlParams')
      this.isHeader = this.$store.state.isHeader
      this.strategy = this.$route.query
    },
    mounted () {
    },
    methods: {
      goBack: function () {
        // history.back()
        this.$router.go(-1)
      },
      reStrategy () {
        let userInfo = this.$store.state.userInfo
        let strategy = this.$route.query
        if (this.strategy.name === '') {
          Toast({
            message: '策略名称不能为空',
            position: 'bottom',
            duration: 3000
          })
        } else {
          REQUEST.allMyStrategys(userInfo).then(res => {
            return res
          }).then(req => {
            let isName = req.filter(v => {
              return v.strategy_name === strategy.strategyName
            })
            if (isName.length <= 0) {
              REQUEST.relMyStrategys(userInfo, strategy).then(res => {
                if (res) {
                  Toast({
                    message: '修改策略名称成功！',
                    position: 'bottom',
                    duration: 3000
                  })
                  this.goBack()
                }
              }).catch(err => {
                Toast({
                  message: '新建策略失败！',
                  position: 'bottom',
                  duration: 3000
                })
                console.info(err)
              })
            } else {
              Toast({
                message: '该策略名称已存在！',
                position: 'bottom',
                duration: 3000
              })
            }
          })
          // REQUEST.relMyStrategys(userInfo, strategy).then(res => {
          //   console.log(res)
          //   if (res) {
          //     Toast({
          //       message: '修改策略名称成功！',
          //       position: 'bottom',
          //       duration: 3000
          //     })
          //     this.$router.push({path: '/strategyEdit'})
          //   }
          // }).catch(err => {
          //   console.info(err)
          // })
        }
      }
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
  #reStrategyName {
    .mint-header.is-fixed {
      background-color: #0f1316;
    }
    .reStrategyName-cont.isHeader {
      margin-top: 1.25rem !important;
    }
    .reStrategyName-cont {
      /*margin-top: 1.25rem;*/
      .writ-btn {
        height: 1rem;
        border-bottom: 1px solid #e5e5e5;
        .input {
          height: inherit;
          padding-left: 0.2666667rem;
          width: 100%;
          border: 0;
        }
      }
      .tip-text {
        text-align: left;
        text-indent: 0.2666667rem;
        padding: 0.2666667rem 0;
      }
      .fin-btn {
        height: 1rem;
        line-height: 1rem;
        background: #0f1316;
        margin: 0.2666667rem;
        color: #ffffff;
        font-size: 0.4rem;
        text-align: center;
        border-radius: 0.1066667rem;
      }
    }
  }
</style>
